import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:love_app/common/su.dart';
import 'package:love_app/providers/bg_model.dart';
import 'package:love_app/providers/home_page_provider.dart';
import 'package:love_app/providers/share_provider.dart';
import 'package:love_app/routes/application.dart';
import 'package:provider/provider.dart';

// 更多的页面
class MoreContent extends StatefulWidget {
  @override
  _MoreContentState createState() => _MoreContentState();
}

class _MoreContentState extends State<MoreContent> {
  BgModel _bgModel;
  ShareProvider _shareProvider;

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    _bgModel = Provider.of<BgModel>(context, listen: false);
    _shareProvider = Provider.of<ShareProvider>(context, listen: false);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      height: Su().h(1184),
      width: Su().w(750),
      decoration: BoxDecoration(
        image: DecorationImage(
          image: _bgModel.firstBgImage,
          fit: BoxFit.fitWidth,
          alignment: Alignment.topCenter,
        ),
      ),
      child: _centent(),
    );
  }

  // 页面内容
  Widget _centent() {
    return Stack(
      children: <Widget>[
        _arrowButton(),
        _cententItem(),
      ],
    );
  }

  // 点击箭头显示更多
  Widget _arrowButton() {
    return Positioned(
      top: Su().h(200),
      right: Su().w(0),
      child: Consumer<HomePageProvider>(
        builder: (context, HomePageProvider homePageModel, child) => InkWell(
          onTap: () {
            homePageModel.updateModel();
          },
          child: Container(
            width: Su().w(141.0),
            height: Su().h(79.0),
            decoration: BoxDecoration(
              color: Color.fromRGBO(255, 255, 255, 0.3),
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(56),
                bottomLeft: Radius.circular(56),
              ),
            ),
            child: _arrowIcondOther(),
          ),
        ),
      ),
    );
  }

  // (position)箭头图标， 点击显示更多的样式
  Widget _arrowIcondOther() {
    return Row(
      children: <Widget>[
        Container(
          padding: EdgeInsets.only(
            left: ScreenUtil().setWidth(20),
          ),
          child: Icon(
            IconData(0xe612, fontFamily: 'loveIcon'),
            color: _shareProvider.textColor,
            size: Su().w(40),
          ),
        ),
        Container(
          padding: EdgeInsets.only(
            left: ScreenUtil().setWidth(10),
          ),
          child: Text(
            '返回',
            style: Su().textStyle(Colors.white, 28),
          ),
        ),
      ],
    );
  }

  // 页面的功能
  Positioned _cententItem() {
    return Positioned(
      bottom: 0,
      child: Container(
        color: Color.fromRGBO(255, 255, 255, 0.7),
        height: Su().h(573),
        width: Su().w(750),
        child: Column(
          children: <Widget>[
            _itemTitle(),
            _warpWidget(),
          ],
        ),
      ),
    );
  }

  // 为你推荐
  Widget _itemTitle() {
    return Container(
      height: Su().h(69),
      child: Row(
        children: <Widget>[
          _itemTitleImage(),
          Text(
            "为您推荐",
            style: Su().textStyle(Colors.black, 28),
          ),
        ],
      ),
    );
  }

  // 推荐图片
  Widget _itemTitleImage() {
    return Container(
      padding: EdgeInsets.only(
        left: Su().w(28),
        right: Su().w(10),
      ),
      child: Image.asset(
        _getImagePath("tuijian"),
        width: Su().w(29),
        height: Su().h(31),
      ),
    );
  }

  String _getImagePath(String name) {
    return "images/home_page_img/" + name + ".png";
  }

  // warp布局
  Widget _warpWidget() {
    return Container(
      padding: EdgeInsets.only(
        top: Su().h(28),
      ),
      child: Wrap(
        runAlignment: WrapAlignment.spaceAround,
        runSpacing: Su().h(30),
        children: <Widget>[
          _warpItem("love_jijin", "恋爱基金", ""),
          _warpItem("love_shiguangji", "恋爱时光机", ""),
          _warpItem("love_yimazhushou", "姨妈助手", "loveYima"),
          _warpItem("love_qingdan", "恋人清单", ""),
          _warpItem("love_naozhong", "情侣闹钟", "loveAlarm"),
        ],
      ),
    );
  }

  // 每一个widget
  Widget _warpItem(String imagePath, String title, String route) {
    return InkWell(
      onTap: () async {
        await Su().hasLover(context, _shareProvider.bindLover, route);
      },
      child: Container(
        width: Su().w(250),
        child: Column(
          children: <Widget>[
            _warpItemImage(imagePath),
            Text(
              title,
              style: Su().textStyle(Colors.black, 22),
            )
          ],
        ),
      ),
    );
  }

  // 每一个相片
  Widget _warpItemImage(String imagePath) {
    return Image.asset(
      _getImagePath(imagePath),
      width: Su().w(94),
      height: Su().w(94),
    );
  }
}
